<template>
  <div>
    御剑乘风来,除魔天地间!===={{ msg }}
    <Ref ref="box"></Ref>
    <input type="text" ref="input" />
    <h1 v-if="flag" ref="h11">这里是H1</h1>
    <button @click="flagg">切换</button>
  </div>
</template>
<script>
import Ref from "./ref/Ref.vue";
export default {
  components: {
    Ref,
  },
  data() {
    return {
      msg: "",
      flag: false,
    };
  },
  mounted() {
    this.msg = this.$refs.box.aaa;
    this.$refs.input.focus();
  },
  computed: {},
  methods: {
    flagg() {
      this.flag = !this.flag;
      if (!this.flag) {
        console.log(this.$refs.h11);
      } else {
        this.$nextTick(() => {
          console.log(this.$refs.h11);
        });
      }
    },
  },
};
</script>
<style lang='less'  scoped>
</style>
